<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/1.css">
    <link rel="stylesheet" href="../lib/bootstrap@3.3.4/css/bootstrap.min.css">
   <script src="../lib/flexible/flexible.debug.js"></script>
    <script src="../lib/flexible/flexible_css.debug.js"></script>
    <link rel="stylesheet" href="../lib/swiper/css/swiper.min.css">
    <script src="../../../jQuery库/jquery-1.10.1.min.js"></script>
</head>
<body>
    <div class="wrapp">
        <div class="tb">
            <div class="t1"><img src="../img/1.png" alt=""><span class='glyphicon glyphicon-align-justify '></span></div>
            <div class="q"></div>
        </div>
    </div>
    <div class="dade">
        <div class="wrap">
            <ul class="list">
                <li class="item"><img src="../img/2.png" alt=""></li>
                <li class="item"><img src="../img/3.png" alt=""></li>
                <li class="item"><img src="../img/4.png" alt=""></li>
                <li class="item"><img src="../img/5.png" alt=""></li>
                <li class="item"><img src="../img/6.png" alt=""></li>
                <li class="item"><img src="../img/7.png" alt=""></li>
                <li class="item"><img src="../img/7.png" alt=""></li>
                <div class="q"></div>
            </ul>
            <ul class="dots">
                  <!-- <li class="current"></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>  -->
            </ul>
        </div> 
        <div class="q"></div>
    </div>
           <div class="swiper-container  wrap2">
                <div class="swiper-wrapper list2">
                    <div class="swiper-slide item2">
                        <div class='li1'>
                            <div class='li11'><img src='../img/8.png'/></div>
                               <div class="li12"></div>
                               <div class='li13'>城市住宅</div>
                        </div>
                        <div class='li2'>
                           <div class='li21'><img src='../img/9.png'/></div>
                              <div class="li22"></div>
                              <div class='li23'>康旅度假 </div>
                       </div>
                    </div>
                    <div class="swiper-slide item2">
                        <div class='li1'>
                            <div class='li11'><img src='../img/10.png'/></div>
                               <div class="li12"></div>
                               <div class='li13'>产业新城</div>
                        </div>
                        <div class='li2'>
                           <div class='li21'><img src='../img/11.png'/></div>
                              <div class="li22"></div>
                              <div class='li23'>物业服务 </div>
                       </div>
                    </div>
                    <div class="swiper-slide  item2">
                        <div class='li1'>
                            <div class='li11'><img src='../img/11.png'/></div>
                               <div class="li12"></div>
                               <div class='li13'>产业新城</div>
                        </div>
                        <div class='li2'>
                           <div class='li21'><img src='../img/12.png'/></div>
                              <div class="li22"></div>
                              <div class='li23'>物业服务 </div>
                       </div> 
                     </div>
                 </div>
                
                 </div>
                 <div class="swiper-pagination anniu rdd"></div>
                
    <script src="../../../swiper/swiper6/swiper-bundle.min.js"></script>
    <script src="../js/2.js"></script>
    <script>
         var wrap = document.querySelector('.wrap');
      var itemArr = document.querySelectorAll('.item');
      var dots = document.querySelector('.dots');
      var next = document.querySelector('.next');
      var pre = document.querySelector('.pre');
      var list = document.querySelector('.list');
      var index = 0;
      var dotsLength = itemArr.length;

      for(var i=0;i<dotsLength;i++){
          var liNode=document.createElement('li');
          liNode.index=i;
          dots.appendChild(liNode);
      }

      dots.children[0].className='current';


      // 克隆
      list.appendChild(itemArr[0].cloneNode(true));

      function move(index){
          var wrapWidth=wrap.offsetWidth;

          // list.style.left=-wrapWidth*index+'px';
          animate(list,-(wrapWidth*index))
          // for(var i=0;i<itemArr.length;i++){
          //     dots.children[i].className='';
          // }
          // dots.children[index].className='current';
          dotsLight(index);
      }



      function dotsLight(index){
          for(var i=0;i<dotsLength;i++){
              dots.children[i].className='';
          }
          if(index==dotsLength){
              index=0;
          }
          dots.children[index].className='current';
      }

      dots.addEventListener('click', function (e) {
            // if(e.target.nodeName == 'UL') return
            /* for (var i = 0; i < dots.children.length; i++) {
                dots.children[i].className = '';
            } */
            move(e.target.index);
        })


        function animate(obj, target) {
            clearInterval(obj.timer);
            obj.timer = setInterval(function () {
                var step = 9;
                var current = obj.offsetLeft;
             
                step = current < target ? step : -step;
                current = current + step;
             
                if (Math.abs(target - current) > Math.abs(step)) {
                    obj.style.left = current + 'px';
                } else {
                    clearInterval(obj.timer);
                    obj.style.left = target + 'px';
                }
            }, 10)
        }


        var timer=setInterval(function(){
            index++;
            if(index==itemArr.length) index=0;
            move(index);
        },600)
    </script>
    <div class="foot">
        <div class="xinwenzhongxin">
            <p>NEWS CENTER</p>
            <div class="xinwen">
                <span>新闻中心</span>
                <a href="javascript:;">更多></a>
            </div>
            <div class="shenghuofangshi"><img src="https://www.risesun.cn/Uploads/image/60a251ca9d34e.jpg" alt=""></div>
        </div>
        <div class="sj">
            <div class='x1'>05-11</div>
            <p class="p1">荣盛发展:关于控股股东一致行动人增...</p>
            <p class="p2">荣盛发展:关于控股股东—致行动人增持公司股份计划时间过半的进展公告</p>
        </div>
        <div class="tebqiehuan">
            <div class="gongsi">
                <ul class="lister">
                    <li class="ative" style="color:red;border-bottom:2px red solid;">公司新闻<div class="bor xianshi"></div>
                    </li>
                    <li>媒体报道<div class="bor"></div>
                    </li>
                    <li>最新公告<div class="bor"></div>
                    </li>
                </ul>
                <div class="box">
                    <div class="yc mo">
                        <div class="tanxun">
                            <div class="shijian">
                                <h1>25</h1>
                                <p>2021.06</p>
                            </div>
                            <div class="tanxuanxuan">
                                <p class="tp1">谭训党学党史筑党梦,...</p>
                                <p class="tp2">百年风华茂，童心向党红，荣盛小<br>达人第9季带领少儿重温党的故</p>
                            </div>
                        </div>
                        <div class="tanxun">
                            <div class="shijian">
                                <h1>25</h1>
                                <p>2021.06</p>
                            </div>
                            <div class="tanxuanxuan">
                                <p class="tp1">谭训党学党史筑党梦,...</p>
                                <p class="tp2">百年风华茂，童心向党红，荣盛小<br>达人第9季带领少儿重温党的故</p>
                            </div>
                        </div>
                    </div>
                    <div class="yc">
                        <div class="tanxun">
                            <div class="shijian">
                                <h1>26</h1>
                                <p>2021.06</p>
                            </div>
                            <div class="tanxuanxuan">
                                <p class="tp1">谭训党学党史筑党梦,...</p>
                                <p class="tp2">百年风华茂，童心向党红，荣盛小<br>达人第9季带领少儿重温党的故</p>
                            </div>
                        </div>
                        <div class="tanxun">
                            <div class="shijian">
                                <h1>26</h1>
                                <p>2021.06</p>
                            </div>
                            <div class="tanxuanxuan">
                                <p class="tp1">谭训党学党史筑党梦,...</p>
                                <p class="tp2">百年风华茂，童心向党红，荣盛小<br>达人第9季带领少儿重温党的故</p>
                            </div>
                        </div>
                    </div>
                    <div class="yc">
                        <div class="tanxun">
                            <div class="shijian">
                                <h1>27</h1>
                                <p>2021.06</p>
                            </div>
                            <div class="tanxuanxuan">
                                <p class="tp1">谭训党学党史筑党梦,...</p>
                                <p class="tp2">百年风华茂，童心向党红，荣盛小<br>达人第9季带领少儿重温党的故</p>
                            </div>
                        </div>
                        <div class="tanxun">
                            <div class="shijian">
                                <h1>27</h1>
                                <p>2021.06</p>
                            </div>
                            <div class="tanxuanxuan">
                                <p class="tp1">谭训党学党史筑党梦,...</p>
                                <p class="tp2">百年风华茂，童心向党红，荣盛小<br>达人第9季带领少儿重温党的故</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="weibu">
        <div class="swiper-container" id="swiper-container-disange">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <div class="foot_tupian">
                        <div class="f1">
                            <p>ABOUT US</p>
                            <h1>走进荣盛</h1>
                        </div>
                        <div class="f2">
                            <p>CULTURE</p>
                            <h1>企业文化</h1>
                        </div>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="foot_tupian">
                        <div class="f3">
                            <p>ABOUT US</p>
                            <h1>走进荣盛</h1>
                        </div>
                        <div class="f4">
                            <p>CULTURE</p>
                            <h1>企业文化</h1>
                        </div>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="foot_tupian">
                        <div class="f5">
                            <p>ABOUT US</p>
                            <h1>走进荣盛</h1>
                        </div>
                        <div class="f6">
                            <p>CULTURE</p>
                            <h1>企业文化</h1>
                        </div>
                    </div>
                </div>
            </div>
            <div class="swiper-pagination  anniu"></div>
            <div class="q"></div>
    </div>
    <div class="mudi">您来访的目的是了解：公司章程 · 产品服务 · 廉洁荣盛</div> 
    <div class="rs">
        <div class="dibu"><img src="https://www.risesun.cn/Public/Images/home/phpcms/zh-cn/fd-logo.png" alt=""></div>
        <div class="denglu">
            <div class="weixin">
                <span class="iconfont">&#xe600;</span>
            </div>
            <div class="qq">
                <span class="iconfont">&#xe603;</span>
            </div>
        </div>
    </div>
    <div class="zuihou">
        <p>Copyright &copy; 2013荣盛房地产发展股份有限公司 <span>冀<br>ICP备11011764</span><img src="https://www.risesun.cn/Uploads/image/bd.png" alt=""></p>
        <p>联系我们 │ 友情链接 │ 网站地图 │ 法律声明 │ 营业执<br>照</p>
    </div>
</div>
    <link rel="stylesheet" href="../lib/swiper/css/swiper.min.css">
    <script src="../js/daohang.js"></script>
    <script src="../js/4.js"></script>
    </body>
    </html>